<!DOCTYPE html>  
<html>
<meta charset="utf-8" />  
<title>省略号</title>  
<style>
    /* 单行 */
    /* .box{
        width: 100px;
        background: red;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    } */
    /* 多行省略 */
    .box{
        max-width: 100px;
        height: 70px;
        background: red;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 3;
        overflow: hidden;
        word-wrap:break-word;
    }
    /* 兼容性方法网上一堆 */
</style>
<body>
    <div class='box'>aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</div>
</body>
</html>